<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <title>{% block pagename %}Omstang{% endblock %}</title>
        
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">

        <!-- Le fav and touch icons -->
        <link rel="shortcut icon" href="/static/favicon.ico">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/static/apple-touch-icon-144x144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/static/apple-touch-icon-114X114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/static/apple-touch-icon-72x72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="/static/apple-touch-icon-precomposed.png">
            
        <link rel="stylesheet" href="/static/css/bootstrap.min.css">
        <style>
            body {
                padding-top: 60px;
                padding-bottom: 40px;
            }
        </style>
        <link rel="stylesheet" href="/static/css/bootstrap-responsive.min.css">
        <link rel="stylesheet" href="/static/css/datepicker.css">


        <script src="/static/js/vendor/modernizr-2.6.1-respond-1.1.0.min.js"></script>

        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="/static/js/vendor/jquery-1.8.2.min.js"><\/script>')</script>
        <script src="/static/js/vendor/bootstrap.min.js"></script>
        <script src="/static/js/vendor/bootstrap-datepicker.js"></script>

        
        {% block addition_header %}{% endblock %}
        <link rel="stylesheet" href="/static/css/main.css">        
        <script src="/static/js/main.js"></script>        
    </head>
    <body>
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
        <![endif]-->

        <!-- This code is taken from http://twitter.github.com/bootstrap/examples/hero.html -->

        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">

                    <a class="brand" href="#">OmStang</a>
                    <div class="nav-user pull-right">
                      <ul class="nav">
                        {% if user.is_authenticated %}
                          <li>
                            <div class="btn-group">
                              <a class="btn btn-primary" href="/accounts/profile/">
                              	<i class="icon-user icon-white"></i> 
                              	<span class="username">{{ user.username }}</span>
                              </a>
                              <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
                              <ul class="dropdown-menu">
                                <li><a href="/accounts/profile/"><i class="icon-info-sign"></i> Profile</a></li>
                                <li><a href="/accounts/profile/"><i class="icon-edit"></i> Edit</a></li>
                                <li><a href="/accounts/profile/"><i class="icon-cog"></i> Setting</a></li>
                                <li class="divider"></li>
                                <li><a href="/accounts/logout/"><i class="icon-off"></i> Logout</a></li>
                              </ul>
                            </div>                          
                          </li>
                          <li><a href="/accounts/logout/"><i class="icon-off icon-white"></i> </a></li>
                        {% else %}
                          <li><a href="/accounts/register/"><i class="icon-edit icon-white"></i> Signup</a></li>
                          <li><a href="/accounts/login/"><i class="icon-off icon-white"></i> Login</a></li>
                        {% endif %}
                      </ul>
                    </div>     
                    <div class="mainnav">
	                    <div class="nav pull-right">
	                      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
	                          <span class="icon-bar"></span>
	                          <span class="icon-bar"></span>
	                          <span class="icon-bar"></span>
	                      </a>      
	                    </div>    
	                    
	                    <div class="nav-collapse collapse">
	                        <ul class="nav">
	                            <li {% if "/" == request.path %} class="active"{% endif %}>
	                              <a href="/"><i class="icon-home icon-white"></i> Home</a>
	                            </li>
	                            <li {% if "/cashflow/" in request.path %} class="active"{% endif %}>
	                              <a href="/cashflow/"> Cash Flow</a>
	                              </li>
	                            <li {% if "/stock/" in request.path %} class="active"{% endif %}>
	                              <a href="/stock/"> Stock</a>
	                            </li>
	                            <li {% if "/#about" == request.path %} class="active"{% endif %}>
	                              <a href="#about"><i class="icon-question-sign icon-white"></i> </a>
	                            </li>
	                            <li {% if "/#contact" == request.path %} class="active"{% endif %}>
	                              <a href="#contact"><i class="icon-envelope icon-white"></i> </a>
	                            </li>
	                          </ul>
	
	
	                    </div><!--/.nav-collapse -->
					</div>
                </div>
            </div>
        </div>

        <div class="container">
          <div class="row">
            <div class="span3">
              {% block nav %}menu{% endblock %}			              
            </div>
            
            <div class="span9">
              {% block content %}
                <section id="maincontent">
                  <div class="page-header">
                    <h1>Title</h1>
                  </div>
                  Content
                </section>
              {% endblock %}
            </div>
          </div>

          <footer>
              <p>&copy; Company 2012</p>
          </footer>            
        </div> <!-- /container -->

        
        <!-- Ending -->


        <script>
            var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
            (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
            g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g,s)}(document,'script'));
        </script>
        <!-- /Ending -->
    </body>
</html>